<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>景旭商城-报价单</title>
<%@ include file="/page/pc/include.jsp"%>
<%--已筛选条件的优化 --%>
<style type="text/css">
	.search-wrap {
	    margin-bottom:10px;
	    text-align: left;
	    border-top: 1px solid #eee;
	    border-bottom: 1px solid #eee;
	    position: relative;
	    z-index: 1;
	    margin-top:3px;
	}
	.search-wrap dl {
	    width: 970px;
	    border-top: 1px dotted #ddd;
	    padding: 10px 10px 5px 10px;
	    margin: 0;
	    overflow: hidden;
	    border-left: 1px solid #eee;
	    border-right: 1px solid #eee;
		border-top: none;
	}
	.search-wrap dl dt {
	    float: left;
	    width: 70px;
	    height: 24px;
	    line-height: 24px;
	    text-align: right;
	    padding: 0px 5px 5px 0;
	    color: #999;
	    overflow: hidden;
	}
	.search-wrap dl dd {
	    float: none;
	    padding: 0px 10px 0 0;
	    margin: 0;
	    overflow: hidden;
	}
	.search-wrap dl dd.moredd {
	    float: right;
	    text-align: left;
	    text-indent: 10px;
	    width: 110px;
	    padding: 0;
	}
	
	.search-wrap .selected-attr-dl .moredd {
	    text-align: right;line-height:26px
	}
	.search-wrap dl dd ul {
	    float: left;
	    padding: 0;
	    margin: 0;
	}
	.search-wrap dl dd .selected-attr {
	    float: left;
	    overflow: hidden;
	}
	.search-wrap dl dd ul li {
	    float: left;
	    padding: 0 20px 5px 5px;
	    line-height: 24px;
	    white-space: nowrap;
	}
	.search-wrap dl dd .selected-attr li {
	    float: left;
	    height: 24px;
	    margin: 0 5px 5px 0;
	    padding: 0;
	}
	.search-wrap dl dd .selected-attr li a {
	    display: block;
	    height: 22px;
	    line-height: 22px;
	    border-width: 1px;
	    border-style: solid;
	    border-color: #eee;
	    padding: 0 26px 0 4px;
	    position: relative;
	    z-index: 1;
	}
	.color {
	    color: /*main_color_start*/#E31939/*main_color_end*/;
	}
	.search-wrap dl dd .selected-attr li b {
	    font-weight: normal;
	}
	.search-wrap dl dd i {
	    float: left;
	    overflow: hidden;
	    width: 4px;
	    height: 1px;
	    margin: 12px 4px 0 0;
	    background: #ccc;
	}
	.search-wrap dl dd .selected-attr li i {
	    color: /*main_color_start*/#E31939/*main_color_end*/;
	}
	.search-wrap dl dd .selected-attr li i {
	    margin: 0;font-style:normal;
	    text-decoration: none;
	    display: block;
	    position: absolute;
	    right: 0;
	    top: 0px;
	    width: 22px;
	    height: 22px;
	    line-height: 20px;
	    text-align: center;
	    font-size: 18px;
	    background-color: #fff;
	}
	.search-wrap dl dd .selected-attr li a:hover{border:1px solid #E31939}
	.search-wrap dl dd .selected-attr li a:hover i{ color: #fff;background:#E31939;}
	
	ul li{vertical-align:top;padding-bottom:  10px;}
</style>
</head>
<body style="background:#ffffff;">
	<div class="wrap">
		<jsp:include page="../_my_header.jsp" />
		<div class="site_wrap18">
			<div class="site_wrap18_con">
				<div class="main">
					<jsp:include page="../_my_left.jsp" />
					<div class="rightitem">
						<div class="wdjf_part">
							<div class="search_part">
								<form id="product_search_form" action="${rootPath}/pc/my/quotation" method="post" >
									<%--类型id --%>
									<input type="hidden"  id="categoryId" name="categoryId" value="${categoryId}"/>
									<%--品牌参数 --%>
									<input type="hidden" id="brandId"  name="brandId" value="${brandId}"/>
									<input type="hidden" id="brandIds"  name="brandIds" value="${brandIds}"/>
									<%--筛选项 --%>
									<input type="hidden" id="propertyFilter"  name="propertyFilter" value="${propertyFilter}"/>
									<%--排序字段 --%>
									<input type="hidden" id="sortField"  name="sortField"  value="${sortField}"/>
									<%--排序类型 --%>
									<input type="hidden" id="sortType"  name="sortType"  value="${sortType}"/>
									<%--价格区间 --%>
									<input type="hidden" id="minPrice" name="minPrice" value="${minPrice}"/>
									<input type="hidden" id="maxPrice" name="maxPrice" value="${maxPrice}"/>		
								</form>
							</div>
	
							<div class="search-wrap" id="attr-list-ul">
								<!--已选条件-->
								<dl class="selected-attr-dl" style="border-bottom: none;">
									<dt id="filter_condition">已选条件：</dt>
									<dd class="moredd">
										<a id="revoke_all_filter" href="javascript:void(0)">全部撤销</a>
									</dd>
									<dd>
										<ul class="selected-attr">
										<c:forEach items="${filterNameList}" var="item">
											<li>
												<a href="javascript:void(0)">
													<b id="filter_name">${item.filterName}</b>：
													<b id="filter_value" class="color">${item.filterValue}</b>
													<i id="${item.filterId}" name="close_filter">×</i>
												</a>
											</li>
											<%--
											<span style="border:1px solid gray;padding:3px;"><span>${item.filterName}:${item.filterValue}</span><a id="${item.filterId}" class="close_filter">X</a></span>
											--%>
										</c:forEach>
										</ul>
									</dd>
								</dl>
							</div>
							
							<!-- 分类开始 -->
							<div class="category_part">
        						<dl>
                					<%-- <dt>
                						<strong><i>类型：</i></strong>
										<div class="txt1">
											<div class="brand_list2">
												<ul>
													<c:forEach items="${topCategoryList}" var="topCategory">
													<li class="top_category_li" categoryId="${topCategory.id}" categoryName=${topCategory.categoryName }>
														<a href="javascript:void(0);">${topCategory.categoryName}</a>
													</li>
													</c:forEach>
												</ul>
											</div>
										</div>
									</dt> --%>
									
            						<dt>
                						<strong><i>品牌：</i></strong>
                    					<div class="txt1">
                    						<div class="brand_nav">
                        						<p>
													<a href="javascript:void(0)" class="current">所有品牌</a>
													<a href="javascript:void(0)">A</a><a href="javascript:void(0)">B</a><a href="javascript:void(0)">C</a><a href="javascript:void(0)">D</a>
													<a href="javascript:void(0)">E</a><a href="javascript:void(0)">F</a><a href="javascript:void(0)">G</a><a href="javascript:void(0)">H</a>
													<a href="javascript:void(0)">I</a><a href="javascript:void(0)">J</a><a href="javascript:void(0)">K</a><a href="javascript:void(0)">L</a>
													<a href="javascript:void(0)">M</a><a href="javascript:void(0)">N</a><a href="javascript:void(0)">O</a><a href="javascript:void(0)">P</a>
													<a href="javascript:void(0)">Q</a><a href="javascript:void(0)">R</a><a href="javascript:void(0)">S</a><a href="javascript:void(0)">T</a>
													<a href="javascript:void(0)">U</a><a href="javascript:void(0)">V</a><a href="javascript:void(0)">W</a><a href="javascript:void(0)">X</a>
													<a href="javascript:void(0)">Y</a><a href="javascript:void(0)">Z</a>
                           						</p>
											</div>
                    						<div class="brand_list1">
                    							<div class="brand_list1_con">
                        							<ul>
														<c:forEach items="${brandList}" var="brand">
															<li brandId = "${brand.id}" brandName = "${brand.brandNameCh}">
																<a href="javascript:void(0)"  >
																	<b>
																		<img src="${imgRootURL}${brand.brandImage}?x-oss-process=image/resize,m_fill,h_36,w_102"/>
																	</b>
																</a>
															</li>
														</c:forEach>
                            						</ul>
                        						</div>
                        					</div>

                        					<c:forEach items="${showBrandList}" var="brandList" varStatus="ind">
                        					<div class="brand_list1">
                        						<div class="brand_list1_con">
                        							<ul>
                        								<c:forEach items="${brandList}" var="brand">
                           								<li brandId = "${brand.id}">
                               								<a href="javascript:void(0)" onclick="brandSearch('${brand.id}')">
                               									<b>
                               										<img src="${imgRootURL}${brand.brandImage}?x-oss-process=image/resize,m_fill,h_36,w_102" />
                               									</b>
                               								</a>
                               							</li>
                               							</c:forEach>
                           							</ul>
                       							</div>
                       						</div>
											</c:forEach>
											<div class="operate_part">
												<p>
													<input type="button" class="inputbtn1" value="确定" /><input type="button" class="inputbtn2" value="取消" />
												</p>
											</div>
											<div class="more_part">
												<p>
													<a href="javascript:void(0);" class="morebtn"><span class="a11">更多</span><span class="a12">收起</span><i class="a1"></i></a>
													<!-- <a href="javascript:void(0);" class="dxbtn"><span>多选</span><i class="a2"></i></a> -->
												</p>
											</div>
										</div>
                					</dt>

                					<dt>
                						<strong><i>商品类型：</i></strong>
                    					<div class="txt1">
                    						<div class="brand_list2">
                        						<ul>
													<c:forEach items="${categoryList}" var="category">
                            						<li class="category_li" categoryId="${category.id}">
                                						<a href="javascript:void(0);">${category.categoryName}</a>
                                					</li>
                                					</c:forEach>
                            					</ul>
											</div>
										</div>
									</dt>

									<c:forEach items="${filterList}" var="filter">
									<dt>
                						<strong><i>${filter.propertyName }：</i></strong>
										<div class="txt1">
                    						<div class="brand_list2">
                        						<ul>
													<c:forEach items="${filter.propertyValueList}" var="pv">
                            						<li class="filter_li" propertyName="${filter.propertyName}"  propertyValue="${pv}">
                                						<a href="javascript:void(0);">${pv}</a>
                                					</li>
                                					</c:forEach>
                            					</ul>
                        					</div>
                    					</div>
									</dt>
									</c:forEach>
								</dl>
							</div>
							<!-- 分类结束 -->
						</div>
						
						<!-- 商品 -->
						<div class="bj_part">
							<input type="hidden"  id="categoryIds" name="categoryIds" value="${categoryIds}"/>
							<input type="hidden"  id="parentCategoryId" name="parentCategoryId" value="${parentCategoryId}"/>
							<input type="hidden"  id="categoryPath" name="categoryPath" value="${categoryPath}"/>
							<div class="search_condition" style="margin-bottom:0px;padding:5px 0;margin-top:-15px;">
								<div class="right" style="margin-right:8px;margin-bottom:0px;">
									<div class="xl_nav">
										<p>
											<a id="btnExportQuotation" href="javascript:;" style="margin-right:3px">导出</a>
											<a id="btnPrintQuotation" href="javascript:;">打印</a>
										</p>
									</div>
								</div>
							</div>
							<div class="bj_part_con">
                    			<table>
                        			<thead>
                            			<tr>
                                			<td>序号</td>
                                		    <td>编码</td>
                                		    <!-- <td>商品图片</td> -->
                                		    <td style="width:422px">商品名称</td>
                                		    <td style="width:140px">价格</td>
										</tr>
									</thead>
                            		<tbody>
										<c:forEach items="${productList}" var="product" varStatus="status">
                            			<tr>
											<td style="width:50px;">${status.index +1 }</td>
											<td style="width:100px;">${product.productCode }</td>
											<%-- <td>
												<img src="${imgRootURL}${product.mainImagePath}?x-oss-process=image/resize,h_100/format,png" class="bjpic" />
											</td> --%>
											<td style="text-align:left;">
												<a href="${rootPath}/pc/product/detail?productId=${product.id}" target="_Blank">
													<!-- <i>
														<img src="images/icon_fav4.jpg" class="favicon" />
													</i> -->
													${product.productName }
												</a>
											</td>
											<td>
												<b>¥<fmt:formatNumber type="number" value="${product.basePrice }" pattern="0.00" /><em></em></b>
											</td>
										</tr>
										</c:forEach>
									</tbody>
								</table>
								<jx:paging formID="product_search_form" isShowJumpToButton="true" numPerPage="50" isShowpageCount="true"></jx:paging>
							</div>
						</div>
						<!-- 商品结束 -->
					</div>
				</div>
			</div>
		</div>
	</div>

	<div>
		<!---网站底部开始-->
		<jsp:include page="../../footer.jsp?showQaFlag=0" />
		<!---网站底部结束-->
	</div>
	<!-- 返回顶部 -->
	<div class="notfixed" id="fixedfloor">
		<div class="leftbar">
			<a href="javascript:void(0)" class="backtop"><img src="${rootPath}/statics/images/icon_backtop1.png" /></a>
		</div>
	</div>
	<!-- 返回顶部 结束-->
<script charset="utf-8" language="javascript" type="text/javascript" src="<%=basePath%>/js/pc/quotation.js"></script>
</body>
</html>